<?php echo $header; ?>
<?php echo $column_left; ?>
<?php echo $column_right; ?>

<div id="content">
<?php echo $content_top; ?>
  <div class="breadcrumb">
    <?php foreach ($breadcrumbs as $breadcrumb) { ?>
    <?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
    <?php } ?>
  </div>
  
  <h1>Продукти</h1><br>

<script type="text/javascript" src="catalog/view/javascript/jquery.carouFredSel-6.2.1-packed.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	var starttab = window.location.hash;

	$(".tabs").carouFredSel({
		circular: false,
		responsive: true,
		items: {
			visible: 1,
			start: starttab
		},
		width: '100%',
		auto: false,
		pagination: {
			container: '.tab-links',
			anchorBuilder: function( nr ) {
				return '<a href="#">' + $(this).attr('data-title'); + '</a>';
			}
		}
	});
});
</script>  
  
  	<div class="tab-links">
    </div>
    
    <div class="tabs three-columns">
    
    
    
    <?php if ($categories) { ?>
            <?php foreach ($categories as $category) { ?>
			<div data-title="<?php echo $category['name']; ?>" id="<?php echo str_replace(' ','-',$category['name']); ?>">
				
                <ul>
				<?php foreach ($category['children'] as $children ) { ?>
                	<li>
                	<a href="<?php echo $children['href']; ?>"><?php echo  $children['name']; ?></a>
                    </li>
				<?php } ?>
                </ul>
				
			</div>
		 <?php } ?>
	<?php } ?>
    	
        
        
    </div>
    
    <br><br>
        
    <?php echo $content_bottom; ?>
 
</div>
<?php echo $footer; ?>